.banner-card {
  width: 100%;
  height: 100%;
  position: relative;
}

.banner-card ul {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  text-align: center;
  position: relative;
}

.banner-card li {
  width: 624px;
  height: 100%;
  position: absolute;
  list-style-type: none;
  transition: 0.5s all ease-out;
  cursor: pointer;
}

.banner-card > li > img {
  display: inline-block;
  width: 100%;
  height: 100%;
}

.two {
  z-index: 2;
  transform: translate3d(-30px, 0, 0) scale(0.9);
  opacity: 0.8;
}

.two2 {
  z-index: 2;
  transform: translate3d(-30px, 0, 0) scale(0.9);
  opacity: 0.8;
}

.three {
  z-index: 3;
  transform: translate3d(60px, 0, 0) scale(1);
  opacity: 1;
}


.four {
  z-index: 2;
  transform: translate3d(150px, 0, 0) scale(0.9);
  opacity: 0.8;
}

.four2 {
  z-index: 2;
  transform: translate3d(150px, 0, 0) scale(0.9);
  opacity: 0.8;
}

.other {
  z-index: 0;
  opacity: 0;
  transform: translate3d(100px,0,0) scale(0.5);
}

.banner-card > div {
  position: absolute;
  top: 50%;
  transform: translateY(-45%);
  cursor: pointer;
  z-index: 999999999;
}

.banner-card div > img {
  display: inline-block;
  font-size: 25px;
}

.left-btn {
  left: 38px;
}

.right-btn {
  right: 37px;
}
